<style>
    body {
        padding-top: 40px; 
    }
    .container {
        width: 300px;
    }

    .container > .content {
        background-color: #fff;
        padding: 20px;
        margin: 0 -20px; 
        -webkit-border-radius: 10px 10px 10px 10px;
        -moz-border-radius: 10px 10px 10px 10px;
        border-radius: 10px 10px 10px 10px;
        -webkit-box-shadow: 0 1px 2px rgba(0,0,0,.15);
        -moz-box-shadow: 0 1px 2px rgba(0,0,0,.15);
        box-shadow: 0 1px 2px rgba(0,0,0,.15);
    }

    .login-form {
        margin-left: 65px;
    }

    legend {
        margin-right: -50px;
        font-weight: bold;
        color: #404040;
    }
</style>
<div class="container">
    <div class="content">
        <div class="row">
            <div class="row-fluid">
                {% block register_content %}
                <div class="login-form">
                    <h2>Register</h2>
                    <form action="{{ registerForm.attribs.action}}" method="{{ registerForm.attribs.method}}">
                        <fieldset>
                            <div class="clearfix">
                                {{ registerForm.elements.username|raw }} 
                            </div>
                            <div class="clearfix">
                                {{ registerForm.elements.password|raw }} 
                            </div>
                            <div class="clearfix">
                                {{ registerForm.elements.confirm|raw }} 
                            </div>
                            <div class="clearfix">
                                {{ registerForm.elements.name|raw }} 
                            </div>
                            <div class="clearfix">
                                {{ registerForm.elements.mobile|raw }} 
                            </div>
                            <div class="clearfix">
                                {{ registerForm.elements.email|raw }} 
                            </div>
                            <div class="clearfix">
                                {{ registerForm.elements.department|raw }} 
                            </div>
                            <button class="btn btn-primary" type="submit">Register</button> 
                            <button class="btn" type="reset">Reset</button> 
                        </fieldset>
                    </form>
                </div>
                {% endblock register_content %}
            </div>
        </div>
        <div class="row-fluid">
            <a href="/login">Back to login page</a>
        </div>
    </div>
</div> <!-- /container -->
